import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Outlay } from '../../../models/outlay';
import { FormGroupItem } from '../../../components/form-group/form-group.interfaces';
import { CommonModalService } from '../../../service/actions/common-modal.service';
import { OutlayService } from '../../../service/outlay.service';
import { FormTestComponent } from '../components/form-test/form-test.component';

@Component({
  selector: 'app-rxjs',
  templateUrl: './rxjs.component.html',
  styleUrls: ['./rxjs.component.scss']
})
export class RxjsComponent implements OnInit {

  count = 2;
  isHide = false;
  name = '';
  myTrack = '';
  aList = [1, 2];

  formItems: FormGroupItem[] = [
    {
      type: 'text',
      name: 'name',
      label: 'Name',
      defaultValue: '',
      placeholder: '请输入name',
      required: true,
      rules: [
        { required: true, msg: '名称不能为空' }
      ]
    },
    {
      type: 'custom',
      name: 'age',
      label: '',
      defaultValue: '',
      placeholder: '请输入age',
      render: 'ageTemp'
    }
  ];

  validateForm: FormGroup = new FormGroup({});
  formGroup: FormGroup = new FormGroup({});
  @ViewChild('ybyForm') ybyForm: any;

  displayName = '';

  onSubmit() {
    console.log('value', this.ybyForm);
  }

  resetForm(form: FormGroup){
    console.log(form);
    this.formGroup = form;
  }

  resetList() {
    if (this.aList.length === 2) {
      this.aList.push(3);
    } else {
      this.aList.pop();
    }
  }

  nzSize: 'small' | 'default' = 'small';
  current = 1;
  startIndex = 1;

  constructor(
    private commonModalService: CommonModalService,
    private outlayService: OutlayService,
    private fb: FormBuilder,
  ) { }

  ngOnInit(): void {
    this.validateForm = this.fb.group({
      name: ['']
    })
  }

  onEnter(name: string) {
    console.log('name', name);
  }

  showModal() {
    const aData: Outlay = {
      name: 'name',
      type: 'type',
      money: '123',
      time: '2021-10-12',
      mark: '123'
    };
    this.commonModalService.createFormModal<Outlay, any>({
      nzTitle: '标题',
      nzContent: FormTestComponent,
      data: aData,
      submit: (value: Outlay) => {
        console.log(value);
        return this.outlayService.list();
      }
    });
  }

}
